<template>
  <div class="xd-label-overview">
      <div class="list">
        <Card>
          <p slot="title">
            <Icon type="md-list" />
            标签总览列表
          </p>
          <Form ref="formInline" :model="formSearch" inline v-show="access !== 'wash'">
              <FormItem prop="depaid">
                <Select class="select" v-model="formSearch.depaid" placeholder="请选择洗涤公司">
                  <Option v-for="item in washList" :value="item.depaid" :key="item.depaid">
                  {{ item.depaname }}
                  </Option>
                </Select>
              </FormItem>
              <FormItem>
                <Button type="primary" @click="handleSeacrh()">查询</Button>
              </FormItem>
          </Form>
          <Table highlight-row stripe :columns="columns" :data="data" ></Table>
          <div style="margin: 10px;overflow: hidden">
            <div style="float: right;">
              <Page :total="page.total" :page-size="page.pageSize" :current="1" @on-change="changePage" show-total></Page>
            </div>
          </div>
        </Card>
      </div>
  </div>
</template>

<script>
import API from "./api";
import ValidatorRule from "@/filters/validator-rule";
import i18n from "./locale";
import mixinTag from "@/mixin/tag-mixin";

export default {
  name: "xd-label-overview",
  mixins: [mixinTag],
  components: {},
  data() {
    return {
      i18n: i18n,
      hospitalList: [],
      washList: [],
      access: "",
      page: {
        total: 0,
        pageSize: 20
      },
      formSearch: {
        depaid: "",
        pageNum: 1,
        pageSize: 20
      },
      editFormInLine: {
        depaid: ""
      },
      columns: [
        {
          title: "序号",
          key: "id"
        },
        {
          title: "客户名称",
          key: "depaname"
        },
        {
          title: "注册数",
          key: "regcnt"
        },
        {
          title: "报废数",
          key: "wastecnt"
        },
        {
          title: "收脏数",
          key: "receivecnt"
        },
        {
          title: "在洗洗涤数",
          key: "inwashcnt"
        },
        {
          title: "分拣数",
          key: "classedcnt"
        },
        {
          title: "已出库",
          key: "outcnt"
        }
      ],
      data: []
    };
  },

  mounted() {
    this.getWashlList();
  },

  activated() {
    this.getWashlList();
  },

  methods: {
    resetInit() {
      this.access = this.$store.state.user.access;
      if (this.access == "wash") {
        this.formSearch.depaid = this.$store.state.user.userInfo.data.depaid;
        this.handleSeacrh();
      }
    },

    getHospitalList() {
      API.getHospitalList({ type: 2 })
        .then(res => {
          if (res.code == 200) {
            this.hospitalList = res.data;
          }
        })
        .catch(err => {
          this.$Message.error("请求异常！");
        });
    },

    getWashlList() {
      API.getWashlList({ type: 1 })
        .then(res => {
          if (res.code == 200) {
            this.washList = res.data;
          }
        })
        .catch(err => {
          this.$Message.error("请求异常！");
        });
    },

    handleSeacrh() {
      let obj = this.formSearch;
      if (obj.depaid == "") {
        this.$Message.error("查询洗涤公司必选！");
        return;
      }
      obj.pageNum = 1;
      this.formSearch = obj;
      this.getList(obj);
    },

    changePage(pageNum) {
      let obj = this.formSearch,
        maxPageNum = Math.ceil(this.page.total / this.page.pageSize);
      if (obj.pageNum > maxPageNum) {
        obj.pageNum = maxPageNum;
      } else {
        obj.pageNum = pageNum;
      }
      this.formSearch = obj;
      this.getList(obj);
    },

    getList(obj) {
      API.getList(obj)
        .then(res => {
          if (res.code == 200) {
            let data = res.data;
            this.page.total = data.total;
            this.page.pageSize = data.pageSize;
            this.data = data.list;
          }
        })
        .catch(err => {
          this.$Message.error("请求异常！");
        });
    }
  }
};
</script>
<style lang="less" >
@import "./xd-label-overview.less";
</style>
